<template>
  <div class="messageContainer">
    <el-table :data="tableData">
      <el-table-column prop="date" label="日期" width="140">
      </el-table-column>
      <el-table-column prop="name" label="商品名" width="120">
      </el-table-column>
      <el-table-column prop="address" label="产地">
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  import Vue from 'vue'
  import {Button, Input} from 'element-ui'

  Vue.component(Button.name, Button)
  Vue.component(Input.name, Input)

  export default {
    name: 'App',
    data () {
      const item = {
        date: '2016-05-02',
        name: '苹果',
        address: '上海市普陀区金沙江路 1518 弄'
      }
      return {
        tableData: Array(10).fill(item)
      }
    },
    beforeRouteUpdate (to, from, next) {
      next()
    },
    mounted () {
      this.num = this.$route.params.id
    },
    methods: {
      handleEdit () {
        this.$store.dispatch('changeNum1', this.num)
      },
      handleGetSession () {
      }
    },
    beforeDestroy () {
    }
  }
</script>

<style scoped>
  .indexContainer {
    font-size: 0.35rem;
  }

  img {
    width: auto;
    max-width: 100%;
  }
</style>
